.cl-tabs {
	width: 100%;

	&__header {
		height: 80rpx;
		position: relative;
		overflow: hidden;
	}

	&__bar {
		height: 90rpx;
		white-space: nowrap;
		text-align: center;
		box-sizing: border-box;

		.uni-scroll-view::-webkit-scrollbar {
			display: none;
		}

		&-item {
			display: inline-block;
			height: 80rpx;
			line-height: 80rpx;
			font-size: 28rpx;
			box-sizing: border-box;

			.cl-tabs__icon {
				font-size: 30rpx;

				&--prefix {
					margin-right: 10rpx;
				}

				&--suffix {
					margin-left: 10rpx;
				}
			}
		}

		&-box {
			position: relative;
			white-space: nowrap;
		}
	}

	&__line {
		height: 4rpx;
		width: 16px;
		position: absolute;
		bottom: 2rpx;
		border-radius: 20rpx;
		transition: all 0.5s;
		background-color: $cl-color-primary;
	}

	&__container {
		height: calc(100% - 80rpx);
		background-color: #fff;

		.cl-tab-pane {
			height: 100%;

			&__scroller {
				height: 100%;
			}
		}
	}

	&.is-sticky {
		.cl-tabs__header {
			position: sticky;
			z-index: 99;

			/* #ifdef H5 */
			top: 44px;
			/* #endif */

			/* #ifndef H5 */
			top: 0;
			/* #endif */
		}
	}

	&.is-content {
		height: 100%;
	}

	&.is-fill {
		.cl-tabs__bar-item {
			flex: 1;
		}
	}

	&.is-border {
		.cl-tabs__header {
			border-bottom: 1rpx solid #eee;
		}
	}
}
